<template>
  <div>
    <el-row>
      <el-col :span="16">
        <el-form ref="form" :model="form" :inline="true" style="text-align: left;height: 38px">
          <el-form-item>
            <el-input v-model="form.filter.kwd" style="float: left;" placeholder="请输入筛选号"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" style="float: left;" @click.native="onSubmit"><i class="el-icon-search"></i>查询
            </el-button>
            <el-button v-if="$utils.ckUIPower('S01010101')&&currentStatus==1" @click="openAddDialog"
                       style="float: left;"><i
              class="el-icon-plus"></i>新增
            </el-button>
            <!-- <el-button v-if="$utils.ckUIPower('S01010101')&&currentStatus==1" @click="changeSubjectActives"
                       style="float: left;" :disabled="editClick">
              批量通过筛选
            </el-button> -->
            <el-button v-if="$utils.ckUIPower('S01010101')&&currentStatus==1" @click="printformedS"
                       style="float: left;" :disabled="editClick">
              批量打印筛选号
            </el-button>
            <el-button v-if="$utils.ckUIPower('S01010101')&&currentStatus==1" @click="download"
                       style="float: left;" :disabled="editClick">
              下载知情同意
            </el-button>
          </el-form-item>
        </el-form>
      </el-col>
      <el-col :span="8">
        <div class="block">
          <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="page.pageNumber"
            :page-sizes="[10, 20, 30]"
            :page-size="10"
            layout="total, prev, pager, next, jumper"
            :total="page.totalRow">
          </el-pagination>
        </div>
      </el-col>
    </el-row>

    <div>
      <el-table stripe
                v-loading="loading"
                element-loading-text="数据加载中"
                :data="page.list"
                style="width:100%"
                @sort-change="onSubmit"
                ref="multipleTable"
                @selection-change="handleSelectionChange"
                border>
        <el-table-column
          type="selection"
          width="55">
        </el-table-column>
        <el-table-column
          fixed
          label="筛选号"
          property="num"
          width="120"
          align="center">
        </el-table-column>
        <el-table-column
          property="name"
          sortable="custom"
          label="姓名"
          width="150"
          align="center">
        </el-table-column>
        <el-table-column
          label="性别"
          property="sex"
          sortable="custom"
          width="150"
          inline-template
          align="center">
          <span style="white-space:nowrap;">
            {{row.sex}}
          </span>
        </el-table-column>
        <el-table-column
          label="招募时间"
          property="recruitDate"
          sortable="custom"
          align="center">
        </el-table-column>
        <el-table-column
          label="初筛结果"
          sortable="custom"
          align="center">
          <template  slot-scope="scope">
                <div class="centerCSS">
                    <img v-show="scope.row.preliminary==1" src="../../../../static/img/right.png" width="20px" height="20px"/>
                    <img v-show="scope.row.preliminary==2" src="../../../../static/img/wrong.png" width="20px" height="20px"/>
                </div>
                    
                </template>
        </el-table-column>
        <el-table-column
          label="筛选结果"
          property="candidateResult"
          sortable="custom"
          width="150"
          inline-template
          align="center">
          <span style="white-space:nowrap;">
            {{candidateResult[row.candidateResult]}}
          </span>
        </el-table-column>
        <el-table-column
          inline-template
          label="操作"
          fixed="right"
          align="center"
          v-if="$utils.ckUIPower('S01010101')"
          width="250">
          <template v-if="currentStatus==1">
          <!-- v-if="row.candidateResult == 0" -->
            <el-button type="text" @click.native="openEditDialog(row.id)"  key="modify" v-if="row.candidateResult == 0">
              修改
            </el-button>
            
            <el-button type="text" @click.native="enterLife(row)" key="modify"  v-if="row.candidateResult == 0" >
              信息录入
            </el-button>
            <!--  <el-button type="text" @click.native="informed(row)" key="modify"   v-if="row.candidateResult == 0">
              知情同意
            </el-button> -->
            <el-button type="text" @click.native="seescreen(row)" key="modify" v-if="row.candidateResult == 0">
              初筛详情
            </el-button>
          <!--    <el-button type="text" @click.native="printformed(row)" key="modify"   >
              打印筛选号
            </el-button> -->
            <!-- <el-button type="text" @click.native="openResultDialog(row)" v-if="row.candidateResult == 0"
                       key="screenResult">筛选结果
            </el-button> -->
          </template>
        </el-table-column>
      </el-table>
    </div>
    <el-dialog title="初筛结果" :visible.sync="screeningBox">
      <div>
        <template>
                    <el-table
                      :data="screenArr"
                      border
                      style="width: 100%">
                      <el-table-column
                        type="index"
                        label="序号"
                        width="90">
                      </el-table-column>
                      <el-table-column
                        prop="sex"
                        label="性别要求"
                        width="150">
                      
                      </el-table-column>
                     
                      <el-table-column
                        prop="type"
                        label="条件"
                        width="120">
                       
                      </el-table-column>
                      <el-table-column
                        label="条件范围"
                        width="120"
                         prop="range">
                        
                      </el-table-column>
                       <el-table-column
                        label="个人性别"
                          prop="mysex">
                        
                      </el-table-column>
                       <el-table-column
                        label="个人条件"
                        width="120"
                          prop="myval">
                        
                      </el-table-column>
                     
                      <el-table-column
                        label="初筛结果">
                        <template  slot-scope="scope">
                        <div class="centerCSS">
                            <img v-show="scope.row.status==1" src="../../../../static/img/right.png" width="20px" height="20px"/>
                            <img v-show="scope.row.status==2" src="../../../../static/img/wrong.png" width="20px" height="20px"/>
                        </div>
                            
                        </template>
                      </el-table-column>
                     <!--  <el-table-column
                        fixed="right"
                        label="操作"
                         >
                        <template  slot-scope="scope">
           
                            <el-button type="text" @click.native="opensf(scope.row.id)">删除</el-button>
                      </template>
                      </el-table-column> -->
                    </el-table>
                  </template>
      </div>
    </el-dialog>

    <el-dialog title="知情同意" :visible.sync="iSoperation" class='width_fi' :before-close="isbPadingClose">
      <div class="isbPading">
        <template>
           <el-checkbox v-model="istongyi" class='texsss' @change='boxchage'>如果同意知情同意请勾选</el-checkbox>
           <div v-if="istongyi" class='tongyibox'>
              筛选号
                    <el-input type="text" v-model="Screening"   @change="numberChage"></el-input>
           </div>
           <div>
              <el-button type="primary" class="addBing addBingRight" @click='isbPadingClose()'>取消</el-button>
           <el-button type="primary" class="addBing addBingRight yy" @click='onfirmc()' :disabled="queisTrue">确定</el-button>
           </div>
          

           
        </template>
      </div>
    </el-dialog>
    <filter-dialog v-bind:dialog-form-visible="dialogData.show"
                   v-on:closeDialog="closeDialog">
    </filter-dialog>
    <edit-dialog :edit-dialog-visible="editDialog.show"
                 @closeEditDialog="closeEditDialog"></edit-dialog>
                 <!-- 生命体征 -->
    <life-dialog :life-dialog-visible="lifeDialog.show"
                 @closeLifeDialog="closeLifeDialog" :subject-id="lifeDialog.subjectsId" ref="child"></life-dialog>
    <result-dialog :result-dialog-visible="resultDialog.show" :id="currentSubjectsId" :num="currentSubjectsNum"
                   @closeResultDialog="closeResultDialog"></result-dialog>
    <!--标签弹框-->
    <tag-dialog :tag-dialog-visible="tagDialog.show" :subject-id="tagDialog.subjectsId"
                :subject-num="tagDialog.subjectsNum"></tag-dialog>
  </div>
</template>
<script>
  import FilterDialog from './filter.dialog.vue'
  import EditDialog from './edit.dialog.vue'
  import ResultDialog from './result.dialog.vue'
  import TagDialog from '../trier/tag.dialog.vue'
  import LifeDialog from './life.dialog.vue'
  import http from '../../../api/http'
  import constants from '../../../commons/constants'
  import store from '../../../store'

  export default {
    data() {
      return {
        scrObj:{},
        queisTrue:true,
        Screening:"",
        istongyi:false,
        screenArr:[],
        screeningBox:false,
        iSoperation:false,
        editClick: false,
        loading: true,
        form: {
          filter: {kwd: '', sort: {create_datetime: 'desc'}},
          pageNo: 1,
          pageSize: 10
        },
        status: ["", ""],
        candidateResult: ['-', '通过', '失败','补位'],
        active: ["禁用", "启用"],
        id: null,
        dialogData: {show: false},
        resultDialog: {show: false},
        editDialog: {show: false},
        lifeDialog:{show:false,subjectsId:''},
        tagDialog: {show: false,subjectsId:'',subjectsNum:''},
        page: {},
        currentSubjectsNum: '',
        currentSubjectsId: '',
        currentProjectId: '',
        currentCandidateID: '',
        currentStatus:1,
        subjectsNumLength: this.$utils.getCurrenrProject().subjectsNumLength,
        filterNumLength: this.$utils.getCurrenrProject().filterNumLength,
        multipleSelection: [],
        server: constants.server
      }
    },
    computed: {},
    methods: {
      download(){
          var vm =this ;
          var projectId = vm.$utils.getCurrenrProject().id;
          http.postData(vm, '/pt/project/downloadMsg', {proid:projectId}, function (resp) {
                console.log(resp)
                
                var ret = resp.body;
                if(ret.code == '111'){
                   document.location.href='https://yikeen.cn:444/api/pt/project/downloadIknow?proid='+projectId+"&login_token="+store.getters.getCurrentLoginInfo.login_token;
                  // vm.$message.success({message:ret.msg});
                 
                }else{
                  vm.$message.error({message:ret.msg});
                }
               
              });
          // console.log(projectId)
      },
      printformedS() {
        var vm = this;
        // console.log(vm.multipleSelection)
        if (vm.multipleSelection.length) {
          vm.$confirm('此操作将批量打印筛选号, 是否继续?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            var projectId = null;
            if (vm.multipleSelection != null && vm.multipleSelection.length > 0) {
              vm.editClick = true;
              var ids = new Array();
              vm.multipleSelection.forEach(function (o) {
                ids.push(o.id);
              });
              projectId = vm.$utils.getCurrenrProject().id;
              http.postData(vm, '/pt/candidateSubjects/candidatNumPrint', {json: JSON.stringify(ids)}, function (resp) {
                console.log(resp)
                vm.editClick = false;
                var ret = resp.body;
                if (ret.code === '111') {
              var list=ret.value;           
            var printHtml = "<button onclick='this.style.display=\"none\";window.print();window.close();' style='font-size: 1.3rem;color: white;background-color:red;'>请确认条码完全加载后再点击打印</button>" +
              "<ul class=\"tagList\">\n";
            // if(list != undefined && list !=null){
            //   printHtml +=
            //     "<li class='isLi'>\n" +
            //     "     <img class='isImg' src=\"" + vm.server + "/createBarCode/Z" + row.id + "\">" +
            //     // "     <div>SubjectId:" + vm.subjectNum + "</div>\n" +
            //     "     <div class='isdiv'>" + list.name+"&nbsp;&nbsp;"+list.num+"</div>" +
            //      // "     <div class='isdiv'>" + subjectInfo.name+"," + subjectInfo.sex+"，" + subjectInfo.age+"岁<br>其他："+ vm.projectNum+"</div>" +
            //     // "     <div>" + vm.projectNum+"</div>\n" +
            //     "</li>\n";
            // }
            if(list!=undefined&&list!=null&&list.length>0) {
              for(var j=0;j<list.length;j++) {
                var item=list[j];
                printHtml +=
                  "<li v-for=\"item in list\">\n" +
                  "     <img src=\"" + vm.server + "/createBarCode/Z"+item.id+"\">\n" +
                  // "     <div>SubjectId:"+vm.subjectNum+"</div>\n" +
                  "     <div>"+item.name+"&nbsp;&nbsp;"+item.num+"</div>\n" +
                  // +(item.pkTime!=undefined&&item.pkTime!=null&&item.pkTime!=''?('PKTime:'+item.pkTime+'&nbsp;'):'')
                  // "     <div>"+item.name+vm.projectNum+"</div>" +
                  // "     <div>"+vm.projectNum+"</div>\n" +
                  "</li>\n";
              }
            }
            printHtml+="</ul><style>\n" +
                " body{padding:0px;} " +
                // " .isImg{float:left;margin-right:3mm;} " +
                // " .isdiv{float:left;margin-top:2mm;} " +
                // " .tagList .isLi{width:140mm;} " +
                ".tagList li * {font-size:0.2rem;padding:0px;}\n" +
                "  .tagList li {list-style: none;width:30mm;height:15mm;margin-left:-10mm;word-break: normal;padding:0.1mm;text-align:center;font-size:8px;}\n" +
                "  .tagList li img {width:25mm;height:10mm;margin-left:-2mm;}" +
                "@media screen {"+
                "  .tagList li img {width:25mm;height:10mm;margin-left:-2mm;}" +
                "  }" +
                "  @media print {\n" +
                "    .tagList li {\n" +
                "      width: 40mm;\n" +
                "      height:20mm;\n" +
                "      page-break-after:always;\n" +
                "      word-break: normal;" +
                "      padding:0.1mm;" +
                "      text-align:center;" +
                "    }\n" +
                "  .tagList li img {width:25mm;height:10mm;margin-left:-2mm;}" +
                "  }</style>";
              var wid = window.open('blank', '_blank', 'width=100px');
              wid.document.write(printHtml);
          } else {
            return false
          }
                // 执行清空操作
                vm.$refs.multipleTable.clearSelection();
              });
            }
          }).catch(() => {
            // 执行清空操作
            vm.$refs.multipleTable.clearSelection();
          });
        } else {
          vm.$message.error('没有勾选项,请确认您的选择')
        }
      },
      // printformed(row){
      //   var vm = this;

      //   http.postData(vm, "/pt/candidateSubjects/candidatNumPrint", {subid:row.id}, function (resp) {
      //     var ret = resp.body;
      //     console.log(resp);
      //     if (ret.code === '111') {
      //         var list=ret.value;           
      //       var printHtml = "<button onclick='this.style.display=\"none\";window.print();window.close();' style='font-size: 1.3rem;color: white;background-color:red;'>请确认条码完全加载后再点击打印</button>" +
      //         "<ul class=\"tagList\">\n";
      //       if(list != undefined && list !=null){
      //         printHtml +=
      //           "<li class='isLi'>\n" +
      //           "     <img class='isImg' src=\"" + vm.server + "/createBarCode/Z" + row.id + "\">" +
      //           // "     <div>SubjectId:" + vm.subjectNum + "</div>\n" +
      //           "     <div class='isdiv'>" + list.name+"&nbsp;&nbsp;"+list.num+"</div>" +
      //            // "     <div class='isdiv'>" + subjectInfo.name+"," + subjectInfo.sex+"，" + subjectInfo.age+"岁<br>其他："+ vm.projectNum+"</div>" +
      //           // "     <div>" + vm.projectNum+"</div>\n" +
      //           "</li>\n";
      //       }
      //       // if(cList!=undefined&&cList!=null&&cList.length>0) {
      //       //   for(var j=0;j<cList.length;j++) {
      //       //     var item=cList[j];
      //       //     printHtml +=
      //       //       "<li v-for=\"item in cList\">\n" +
      //       //       "     <img src=\"" + vm.server + "/createBarCode/C"+item.id+"\">\n" +
      //       //       // "     <div>SubjectId:"+vm.subjectNum+"</div>\n" +
      //       //       "     <div>"+subjectInfo.randomNum+"&nbsp;"+"P"+item.cycles+"&nbsp;"+item.name+"</div>\n" +
      //       //       // +(item.pkTime!=undefined&&item.pkTime!=null&&item.pkTime!=''?('PKTime:'+item.pkTime+'&nbsp;'):'')
      //       //       // "     <div>"+item.name+vm.projectNum+"</div>" +
      //       //       // "     <div>"+vm.projectNum+"</div>\n" +
      //       //       "</li>\n";
      //       //   }
      //       // }
      //       printHtml+="</ul><style>\n" +
      //           " body{padding:0px;} " +
      //           // " .isImg{float:left;margin-right:3mm;} " +
      //           // " .isdiv{float:left;margin-top:2mm;} " +
      //           // " .tagList .isLi{width:140mm;} " +
      //           ".tagList li * {font-size:0.2rem;padding:0px;}\n" +
      //           "  .tagList li {list-style: none;width:30mm;height:15mm;margin-left:-10mm;word-break: normal;padding:0.1mm;text-align:center;font-size:8px;}\n" +
      //           "  .tagList li img {width:25mm;height:10mm;margin-left:-2mm;}" +
      //           "@media screen {"+
      //           "  .tagList li img {width:25mm;height:10mm;margin-left:-2mm;}" +
      //           "  }" +
      //           "  @media print {\n" +
      //           "    .tagList li {\n" +
      //           "      width: 40mm;\n" +
      //           "      height:20mm;\n" +
      //           "      page-break-after:always;\n" +
      //           "      word-break: normal;" +
      //           "      padding:0.1mm;" +
      //           "      text-align:center;" +
      //           "    }\n" +
      //           "  .tagList li img {width:25mm;height:10mm;margin-left:-2mm;}" +
      //           "  }</style>";
      //         var wid = window.open('blank', '_blank', 'width=100px');
      //         wid.document.write(printHtml);
      //     } else {
      //       return false
      //     }
      //   });
      // },
      numberChage(){
        if(this.Screening!=''){
          this.queisTrue=false;
        }else{
          this.queisTrue=true;
        }
      },
      onfirmc(){
        var vm =this;

        http.postData(vm, '/pt/candidateSubjects/ikonw', {subid:vm.scrObj.id,num:vm.Screening}, function (resp) {
                console.log(resp)
                var ret = resp.body;
                if(ret.code == '111'){
                   vm.iSoperation=false;
                  vm.$message.success({message:ret.msg});
                  vm.onSubmit();
                }else{
                  vm.$message.error({message:ret.msg});
                }
               
              });
      },
      informed(row){
        // console.log(row)

        var vm =this;
        vm.scrObj=row;
          this.queisTrue=true;

        vm.iSoperation=true;
        vm.istongyi=false;
        // http.postData(vm, '/pt/candidateSubjects/ikonw', {}, function (resp) {
        //         console.log(resp)
        //         var ret = resp.body;
        //         if(ret.code == '111'){
                  
        //         }else{
                  
        //         }
               
        //       });

      },
      boxchage(){
        this.Screening='';
       this.queisTrue=true;
      },
      isbPadingClose(){
        this.iSoperation=false;
        this.istongyi=false;
      },
      //批量修改筛选者状态
      changeSubjectActives() {
        var vm = this;
        // console.log(vm.multipleSelection)
        //console.log(vm.multipleSelection.length)
        if (vm.multipleSelection.length) {
          vm.$confirm('此操作将批量更改筛选者状态, 是否继续?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            var projectId = null;
            if (vm.multipleSelection != null && vm.multipleSelection.length > 0) {
              vm.editClick = true;
              var ids = new Array();
              vm.multipleSelection.forEach(function (o) {
                ids.push(o.id);
              });
              projectId = vm.$utils.getCurrenrProject().id;
              http.postData(vm, '/pt/candidateSubjects/changeSubjectActives/' + projectId, {json: JSON.stringify(ids)}, function (resp) {
                vm.editClick = false;
                var ret = resp.body;
                if(ret.code == '111'){
                  vm.$message.success({message:ret.msg});
                  vm.onSubmit();
                }else{
                  vm.$message.error({message:ret.msg});
                }
                // 执行清空操作
                vm.$refs.multipleTable.clearSelection();
              });
            }
          }).catch(() => {
            // 执行清空操作
            vm.$refs.multipleTable.clearSelection();
          });
        } else {
          vm.$message.error('没有勾选项,请确认您的选择')
        }
      },
      handleSelectionChange(val) {
        this.multipleSelection = val;
      },
      onSubmit(sortCol) {
        var vm = this;
        if (sortCol && sortCol.prop != undefined && sortCol.prop != '' && sortCol.prop != 'undefined') {
          var sortJson = '{"' + sortCol.prop + '":"' + (sortCol.order == 'descending' ? 'desc' : 'asc') + '"}';
          // console.log(sortJson);
          vm.form.filter.sort = JSON.parse(sortJson);
          vm.form.pageNo = 1;
        }
        vm.loading = true;
        if (vm.$utils.getCurrenrProject().id == null) {
          vm.$notify({title: '操作提示', message: '请选择项目', type: 'error'});
        }
        http.postData(vm, "/pt/candidateSubjects/page/" + this.$utils.getCurrenrProject().id, {
          json: JSON.stringify(vm.form.filter),
          pageNo: vm.form.pageNo,
          pageSize: vm.form.pageSize
        }, function (resp) {
          var ret = resp.body;
          // console.log(ret)
          if (ret.code == '111') {
            vm.page = ret.value;
          }
          vm.loading = false;
        });
      },
      openResultDialog(row) {
        this.currentSubjectsNum = row.num;
        this.currentSubjectsId = row.id;
        this.resultDialog.show = true;
      },
      //录入生命体征
      enterLife(row){
          var vm = this;
        this.currentCandidateID = row.id;
        this.lifeDialog.show = true;
       this.$refs.child.comeclie(row.id)
        // if (subjects != undefined && subjects.id != ''){
          this.lifeDialog.subjectsId =row.id;
        // }
      },
      openAddDialog(id_) {
//        this.$set(this.dialogData, 'show', true);
        var vm = this;
        this.dialogData.show = true;
        if (id_ != undefined && typeof id_ == "string") {
          this.id = id_;
        } else {
          this.id = '';
        }
      },
      //初筛结果弹出框
      seescreen(row){
        var vm =this;
        vm.screeningBox=true;
        http.postData(vm, "/pt/screening/preliminary", {subid:row.id}, function (resp) {
            var ret = resp.body;
            // console.log(ret)
            if (ret.code === '111') {
                vm.screenArr=ret.value;

            } else {
                vm.screenArr=[];
            }
          });
      },
      openEditDialog(id) {
        var vm = this;
        this.currentCandidateID = id;
        this.editDialog.show = true;
      },
      loadData() {
        var vm = this;
        if (this.id != undefined && this.id != '') {
          http.postData(vm, "/sys/account/detail/" + this.id, {}, function (resp) {
            var ret = resp.body;
            if (ret.code === '111') {
              vm.form = ret.value;
            } else {
              vm.$notify.error({title: '操作失败', message: ret.msg});
            }
          });
        }
      },
      closeResultDialog(subjects) {
        this.resultDialog.show = false;
        if (subjects != undefined && subjects.id != ''){
          this.tagDialog.show = true;
          this.tagDialog.subjectsId =subjects.id;
          this.tagDialog.subjectsNum=subjects.num;
        }
      },
      closeEditDialog() {
        this.editDialog.show = false;
      },
      closeLifeDialog(){
        this.lifeDialog.show = false;

      },
      closeTagDialog() {
        this.tagDialog.show = false;
        this.tagDialog.subjectsId ='';
        this.tagDialog.subjectsNum='';
      },
      closeDialog() {
//        this.$set(this.dialogData, 'show', false);
        this.dialogData.show = false;
      },
      handleSizeChange() {
        this.form.pageNo = 1;
        this.onSubmit();
      },
      handleCurrentChange(val) {
        this.form.pageNo = val;
        this.onSubmit();
      }
    },
    components: {
      FilterDialog,
      EditDialog,
      ResultDialog,
      TagDialog,
      LifeDialog
    },
    created() {
      this.onSubmit();
      var vm = this;
    }
  }
</script>
<style>
.centerCSS{
  margin-top: 5px;
}
.tongyibox{
  margin-top: 20px;
}
.yy{
  margin-right: 20px;
}
.isbPading{
  padding:10px 0;
}
.width_fi .el-dialog--small{
  width:40%;
}
</style>
